<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>	
<script src="http://code.jquery.com/jquery-migrate-1.1.0.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/sunny/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	var kind="all"; // 검색 종류		
	$("#search").change(function(){
		kind = $("#search").val(); 
		//alert(kind);
	});
	$("#hintKeyword").autocomplete({
		source : function(request, response){
			//alert(request.term); // 검색어 입력 정보가 출력
			$.ajax({
				type : "get",
				url : "${initParam.root}main/autoKeyword.moja",
				dataType : "json",
				data : "keyword=" + request.term + "&kind=" + kind,
				success : function(jsonData){
					response(jsonData);
				}
			}); // ajax
		} // source
	}); // autocomplete
	$(":button[name=searchButton]").click(function(){	
		var keyword=$(":input[name=keyword]").val(); // 검색어
	//	alert(kind);
		if(keyword != ""){
			if(kind == 'info'){
				location.href="${initParam.root}info/findByKeyword.moja?keyword="+keyword;
			}else if(kind == 'item'){
				location.href="${initParam.root }item/getItemList.moja?keyword="+keyword;
			}else if(kind == 'all'){
				location.href="${initParam.root}main/NewsearchAll.moja?keyword="+keyword;
			}
		}else{
			alert("검색어를 입력해주세요.");
		}
	});
});
</script>
 <style>
.gray {
   color: #e9e9e9;
/*    border: solid 1px #555;
 */   background: #6e6e6e;
   background: -webkit-gradient(linear, left top, left bottom, from(#888), to(#575757));
   background: -moz-linear-gradient(top,  #888,  #575757);
   filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888', endColorstr='#575757');
}
</style>

<div id="mainCss">
	<div align="center">
		<form action="${initParam.root}main/NewsearchAll.moja" method = "get" id = "searchAllFrm">
			<select id="search">
				<option value="all">통합검색</option>
				<option value="item">상품검색</option>
				<option value="info">정보검색</option>
			</select>&nbsp;&nbsp;
			<input type="text" name="keyword" id = "hintKeyword"size="50px"> &nbsp;
			<input type="button" name="searchButton" value ="검색" class="gray" >
			
		</form>
	</div>
	<hr>
	<div align="center">
		<a href="${initParam.root}item/auth_getCategory.moja"><img src="${initParam.root }img/tab1.jpg" height="200"></a>
		<a href="${initParam.root }board/getboardlist.moja?pageNo=1"><img src="${initParam.root }img/tab2.jpg" height="200"></a>
		<img src="${initParam.root }img/aa.jpg" height="200">
	</div>
	<hr>
<div align="left" style="z-index: 0">
	<div style="width: 45%; z-index: 1; float: left; margin-right: 10px;" align="right">
	<table style="width: 70%" >
		<thead>
			<tr><td><img src="${initParam.root }img/star.jpg" width="20px" height="20px"><font size="3px"><b>구매랭킹 TOP5</b></font></td></tr>
			<th>순위</th><th>상품명</th><th>구입 횟수</th>
		</thead>
		<c:forEach items="${requestScope.map }" var="map" >
		<c:set var="in" value="${1 }" />
		
		<c:if test="${map.key=='item' }">
			<c:forEach items="${map.value }" var="rankVO" end="4" varStatus="i">
				<tr align="center">
				<td>${i.index+1 }위</td><td>${rankVO.keyword }</td><td>${rankVO.cnt }</td>
				</tr>			
			</c:forEach>
		</c:if>
		</c:forEach>
	</table>
	
	</div>
	<div style="width: 45%; z-index: 2;  float: left; margin-left: 10px;" align="left">
	<table style="width: 70%">
			<thead>
			<tr><td><img src="${initParam.root }img/star.jpg" width="20px" height="20px"><font size="3px"><b>검색랭킹 TOP5</b></font></td></tr>
			<th>순위</th><th>검색어</th><th>검색 횟수</th>
		</thead>
		<c:forEach items="${requestScope.map }" var="map" >
		<c:if test="${map.key=='info' }">
			<c:forEach items="${map.value }" var="rankVO" end="4" varStatus="i">
				<tr align="center">
				<td>${i.index+1 }위</td><td>${rankVO.keyword }</td><td>${rankVO.cnt }</td>
				</tr>			
			</c:forEach>
		</c:if>
		</c:forEach>
	</table>
	
	</div>
	
</div><br>

</div>
	 




